import { Component, ChangeDetectionStrategy } from '@angular/core';
import { Router } from '@angular/router';
import { Subject } from 'rxjs';

@Component({
  templateUrl: './change-event.component.html',
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ChangeEventComponent {
  public changeState$ = new Subject<boolean>();
  activeIndex = 0;

  constructor(public router: Router) {}

  beforeChange = (originTab, activeTab) => {
    if (activeTab.index === 2) {
      this.router.navigate(['/components/modal']);
      return false;
    } else {
      const timeOut = setTimeout(() => {
        clearTimeout(timeOut);
        return this.changeState$.next(true);
      }, 1000);
      return this.changeState$;
    }
  };

  afterChange = (originTab, activeTab) => {
    console.log('Change success.', originTab.lvTitle, activeTab.lvTitle);
  };

  indexChange = index => {
    console.log('activeIndex:', index);
  };
}
